<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<title></title>
	<link rel="stylesheet" href="Public/Bootstrap/Css/bootstrap.min.css" />
	<!--载入百度编辑器-->
	<script type="text/javascript" charset="utf-8" src="Public/Admin/ueditor1_4_3/ueditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="Public/Admin/ueditor1_4_3/ueditor.all.min.js"> </script>
    <script type="text/javascript" charset="utf-8" src="Public/Admin/ueditor1_4_3/lang/zh-cn/zh-cn.js"></script>
	<script src="public/Admin/js/jquery-1.8.2.min.js" type="text/javascript" charset="utf-8"></script>
	<!-- 上传插件需要载入的文件 -->
  
    <script type="text/javascript" src="Public/Admin/uploadify/jquery.uploadify.min.js"></script>
    <link rel="stylesheet" type="text/css" href="Public/Admin/uploadify/uploadify.css">
	<style type="text/css">
		/*去掉uploadify上传按钮的边框*/
	    .uploadify-button {
	        background-color: transparent;
	        border: none;
	        padding: 0;
	    }
	    .uploadify:hover .uploadify-button {
	        background-color: transparent;
    	}
    	.hide{
    		display: none;
    	}
    	body{
    		margin-bottom: 100px;
    	}
	</style> 

	<script type="text/javascript">
		$(function(){
			$('select[name=category_cid]').change(function(){
				//获得选中的option的tid
				var type_tid = $('option:selected').attr('type_tid');
//				console.log(tid);
				$.ajax({
					type:"post",
					url:"{{U('Shop/getAttr')}}",
					data:{t : type_tid},
					//确定返回数据类型
					dataType:'json',
					success:function(phpData){
//						打印
						console.log(phpData);
						var attr = '';
						var spec = '';
						$.each(phpData, function(k,v) {    
							//如果是属性
							if(v.is_recycle == 0){
								attr += '<tr class="info">';
								attr += '<td>'+v.aname+'</td>';
								attr += '<td>';
								attr += '<select name="attr['+v.aid+']" id="">';
								attr += '<option value="">请选择</option>';
									 $.each(v.avalue, function(kk,vv) {    
										attr += '<option value="'+vv+'">'+vv+'</option>';
									 });
								attr += '</select>';
								attr += '</td></tr>';
								
							}else{//如果是规格
								spec += '<tr class="info">';
								spec += '<td>'+v.aname+'</td>';
								spec += '<td>';
								spec += '<select name="spec[value]['+v.aid+'][]" id="">';
								spec += '<option value="">请选择</option>';
									$.each(v.avalue, function(kk,vv) {    
										spec += '<option value="'+vv+'">'+vv+'</option>';                                                          
									});
								spec += '</select></td>';
								spec += '<td>';
								spec += '<a href="javascript:;" class="btn btn-primary addSpec">添加规格</a>';
								spec += '</td></tr>';
							}
							                                                        
						});
						
						$('#attr').html(attr);
						$('#spec').html(spec);
					}
				});
			})
			//点击添加规格
			$('.addSpec').live('click',function(){
				//找到当前的父级的tr
				var trObj = $(this).parents('tr');
				//克隆一个
				var tr = trObj.clone();
				tr.find('.addSpec').html('删除规格').removeClass('btn-primary addSpec').addClass('btn-info removeSpec');
				//再插入到当前父级的下面
				trObj.after(tr);
				
			})
			$('.removeSpec').live('click',function(){
				$(this).parents('tr').remove();
			})
		})
	</script>
	
</head>
<body>
	<div class="container-fluid">
	<div class="row-fluid">
	<div class="span12">
	<form action="" method='post' enctype="multipart/form-data">
		<fieldset>
			<legend>添加商品</legend>
			<table class='table table-bordered table-hover'>
				<thead>
					<tr>
						<th colspan="2" class="btn btn-primary">基本信息</th>
					</tr>
				</thead>
				<tbody>
					<tr class="info">
						<td>所属分类</td>
						<td>
							<select name="category_cid">
								<option value="0">-请选择-</option>
								{{foreach from="$CategoryData" value="$v"}}
									<option value="{{$v['cid']}}" type_tid={{$v['type_tid']}}>{{$v['_name']}}</option>
								{{endforeach}}
							</select>
						</td>
					</tr>
					<tr class="info">
						<td>所属品牌</td>
						<td>
							<select name="brand_id">
								<option value="0">-请选择-</option>
								{{foreach from="$brandDate" value="$value"}}
								<option value="{{$value['id']}}">{{$value['name']}}</option>
								{{endforeach}}
							</select>
						</td>
					</tr>
					<tr class="info">
						<td>商品名称</td>
						<td>
							<input type="text" name='sname' placeholder="请添加商品名称"/>
						</td>
					</tr>
					<tr class="info">
						<td>单位</td>
						<td>
							<input type="text" name='company' value='辆'/>
						</td>
					</tr>
					<tr class="info">
						<td>库存</td>
						<td>
							<input type="text" name='stock' value=''/>
						</td>
					</tr
					<tr class="info">
						<td>货号</td>
						<td>
							<input type="text" name='number' value='' placeholder="请添加货号"/>
						</td>
					</tr>
					<tr class="info">
						<td>市价场</td>
						<td>
							<input type="text" name='market'/>
						</td>
					</tr>
					<tr class="info">
						<td>商城价</td>
						<td>
							<input type="text" name='shop'/>
						</td>
					</tr>
					
				</tbody>
			</table>

			<p class="btn btn-primary">商品属性</p>
			<table class="table table-bordered table-hover" id='attr' class="info" >
				
				
			</table>
			<p class="btn btn-primary">商品规格</p>
			<table class="table table-bordered table-hover" id='spec'>
				
			</table>

			<table class='table table-bordered'>
				<tr>
					<th colspan="3" class="btn btn-primary">列表图</th>
				</tr>
				<tr class="info">
					<td>上传图片</td>
					<td>
						<input id="exampleInputEmail1" type="file"  name="listGraph">
					</td>
					<td id='pic-list'></td>
				</tr>
			</table>

			<table class='table table-bordered'>
				<tr>
					<th colspan="3" class="btn btn-primary">商品图册</th>
					
				</tr>
				<tr class="info">
					<td>上传图片</td>
					<td>
						<div lab="uploadFile">
					    <input id="f" type="file" multiple="true">
					    <span>类型: *.jpg,*.png 大小: 2000KB 数量: 10</span>
					    <script type="text/javascript">
					        $(function() {
					//      	alert();
					            $('#f').uploadify({
					                'formData'     : {//POST数据
					                    '<?php echo session_name();?>' : '<?php echo session_id();?>',
					                },
					                'fileTypeDesc' : '上传文件',//上传描述
					                'fileTypeExts' : '*.jpg;*.png',
					                'swf'      : '{{__PUBLIC__}}/Admin/uploadify/uploadify.swf',
					                'uploader' : '{{U('upload')}}',
					                'buttonText':'选择文件',
					                'fileSizeLimit' : '2000KB',
					                'uploadLimit' : 1,//上传文件数
					                'width':65,
					                'height':25,
					                'successTimeout':10,//等待服务器响应时间
					                'removeTimeout' : 0.2,//成功显示时间
					                'onUploadSuccess' : function(file, data, response) {
										//转为json
					                    data=$.parseJSON(data);
					                    //获得图片地址
					                    var imageUrl = data.url;
					                    var li="<li>";
					                    li += "<img src='"+imageUrl+"'/>";
					                    li += "<input type='hidden' name='atlas' value='"+data.path+"'/><a href='javascript:;' id='self-close'>X</a>";
					                    li += "</li>";
					                    $("#uploadList ul").prepend(li);
					                }
					               
					            });
					            //关闭图片
					            var i = 1;
					            $('#self-close').live('click',function(){
					                $(this).parent('li').remove();
					                i++;
					                $('#f').uploadify('settings','uploadLimit',i);
					            })
					        });					       
					    </script>
					    <div id="uploadList">
					        <ul>
					
					        </ul>
					    </div>
					</div>
					</td>
					<td id='photo-list'></td>
				</tr>
			</table>

			<table class='table'>
				<tr class="next_show">
					<th class="btn btn-primary">商品详细</th>
					<!--调用百度编辑器-->
						<script id="editor" type="text/plain" style="width:100%;height:500px;" name="detailed"></script>
					    <script>
					        var ue = UE.getEditor('editor');
					    </script>
				</tr>
				<tr class="hide info">
					<td>
						<textarea name="detailed" id="intro"></textarea>
					</td>
				</tr>
			</table>

			<!--<table class='table'>
				<tr class="next_show">
					<th class="btn btn-primary">售后服务</th>
				</tr>
				<tr class="hide info">
					<td>
						<textarea name="service" id="service"></textarea>
					</td>
				</tr>
			</table>-->


			<input type="submit" value="确认添加" class="btn btn-primary btn-block btn-large" />
		</fieldset>
	</form>

	</div>
	</div>
	</div>
</body>
</html>